import React from 'react'
import {Carousel} from 'antd'
import {Router, Route, Link, browserHistory} from 'react-router'

export default class MobileCarousel extends React.Component {
    constructor() {
        super()
        this.state = {
            carouse: ''
        }
    }
    componentWillMount() {
        const myFetchOptions = {
            method: 'GET'
        }
        fetch("http://newsapi.gugujiankong.com/Handler.ashx?action=getnews&type=" + this.props.type + "&count=" + this.props.count, myFetchOptions)
            .then(response => response.json())
            .then(json => {
                this.setState({carouse: json})
            })

    }
    render() {
        var settings = {
            dots: true,
            infinite: true,
            autoplay: true,
            speed: 500,
            pauseOnHover: true,
            draggable: true, //鼠标拖拽
        }
        const {carouse} = this.state
        const carousels = carouse.length
            ? carouse.map((itemImg, index) => (
                <Link to={`details/${itemImg.uniquekey}`} key={index}>
                    <div>
                        <img src={itemImg.thumbnail_pic_s} alt=""/>
                    </div>
                </Link>
            ))
            : <Carousel {...settings}>
                <div>
                    <img
                        src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498652513034&di=f76da3ff2f22d5dc213218154d6b1ef9&imgtype=0&src=http%3A%2F%2Fimg.kumi.cn%2Fphoto%2Fbb%2Fba%2Fbd%2Fbbbabdb023def9b0.jpg"
                        alt=""/>
                </div>
                <div>
                    <img
                        src="https://ss3.baidu.com/9fo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/fcfaaf51f3deb48fbe72f4aff01f3a292df578a3.jpg"
                        alt=""/>
                </div>
                <div>
                    <img
                        src="https://ss3.baidu.com/9fo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/fcfaaf51f3deb48fbe72f4aff01f3a292df578a3.jpg"
                        alt=""/>
                </div>
                <div>
                    <img
                        src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498652513034&di=f76da3ff2f22d5dc213218154d6b1ef9&imgtype=0&src=http%3A%2F%2Fimg.kumi.cn%2Fphoto%2Fbb%2Fba%2Fbd%2Fbbbabdb023def9b0.jpg"
                        alt=""/>
                </div>
            </Carousel>
        return (
            <div className="mobile_carousel">
                <Carousel {...settings}>
                    {carousels}
                </Carousel>
            </div>
        )
    }
}